/**
 * ProgressBar.js
 * Version: 1.0
 * Author: wyh
 * 该组件的使用依托jquery，以及openlayers,map组件
 */
var ProgressBar = function (progressdata) {

    //展示图层url,geojson格式，展示字段（表示百分比的字段0-100）
    var _progressdata;

    this.setProgressData = function (progressdata) {

        _progressdata = progressdata;
    };
    this.getProgressData = function () {
        return _progressdata;
    };

    this.setProgressData(progressdata);

    this.showProgress = function () {
        //避免js文件未加载完，运行报错
        $LAB.script(getJSPathbyName("ProgressBar.js") + "jquery.myProgress.js").wait(function(){
            InitProgressOverlay(_progressdata);
        });
        //刷新地图，否则overlay图层会有偏移
        setTimeout(function () {
            var ptcenter = map.getView().getCenter();
            map.getView().setCenter([ptcenter[0], ptcenter[1] + 0.01]);
        }, 100);
    };
}

//加载Overlay上各个进度条
function InitProgressOverlay(progressdata) {
    for (var i = 0; i < progressdata.length; i++) {

        try {
            var curpt = progressdata[i];
            var x = curpt.x;
            var y = curpt.y;
            var value = curpt.percentage;
            InitProgres(x, y, value);
        } catch (e) {
            console.log(e.name + ": " + e.message + "----" + i);
        }
        InitProgres(x, y, value);
    }
}

//加载Overlay上各个进度条
/*function InitProgressOverlay(url, displayField) {
    var points;//展示点位
    $.ajax({
        type: "get",
        /!*url: "http://172.19.18.223:5555/rdbmsserver?table=qy",*!/
        url: url,
        success: function (msg) {
            points = $.parseJSON(msg).features;
            for (var i = 0; i < points.length; i++) {

                try {
                    var curpt = points[i];
                    var x = curpt.geometry.coordinates[0];
                    var y = curpt.geometry.coordinates[1];
                    var value = curpt.properties[displayField];
                    InitProgres(x, y, value);
                } catch (e) {
                    console.log(e.name + ": " + e.message + "----" + i);
                }
                InitProgres(x, y, value);
            }
        },
        error: function () {
        }
    });
}*/

//初始化单个进度条
function InitProgres(x, y, value) {
    var div = document.createElement('div');
    div.setAttribute("id", "divpg");
    //拼接界面
    /*var pgdiv = '<div class="progress-out" style="position: relative; border: 1px solid #13C2B6; background-color: #fff;" id="div1">';
    pgdiv = pgdiv + '<div class="percent-show" style="position: absolute; width: 100%; height: 100%; top: 0; left: 0; color: #000; text-align: center; z-index: 2;"><span>0</span>%</div>';
    pgdiv = pgdiv + '<div class="progress-in" style="position: absolute; height: 100%; width: 0%; border: none; background-color: #13C2B6; background-image: linear-gradient(top, #15E5D8 0%, #12EADE 40%, #1ABFB4 100%); background-image: -webkit-linear-gradient(top, #15E5D8 0%, #12EADE 40%, #1ABFB4 100%); background-image: -moz-linear-gradient(top, #15E5D8 0%, #12EADE 40%, #1ABFB4 100%); background-image: -o-linear-gradient(top, #15E5D8 0%, #12EADE 40%, #1ABFB4 100%); background-image: -ms-linear-gradient(top, #15E5D8 0%, #12EADE 40%, #1ABFB4 100%); text-align: center; color: #fff; z-index: 1;"></div>';
    pgdiv = pgdiv + '</div>';*/

    var pgdiv = '<div class="progress-out" id="div1">';
    pgdiv = pgdiv + '<div class="percent-show"><span>0</span>%</div>';
    pgdiv = pgdiv + '<div class="progress-in"></div>';
    pgdiv = pgdiv + '</div>';

    $("#divpg").html(pgdiv);
    $("#div1").myProgress({speed: 1000, percent: value <= 100 ? value : 100, width: "100px", height: "15px"});

    var pt = ol.proj.transform([x, y], 'EPSG:4326', 'EPSG:3857');
    var progress = new ol.Overlay({
        position: pt,
        positioning: 'center-center',
        element: div
    });
    map.addOverlay(progress); //后续封装完善map也需作为参数传入
}

//根据名字获取js文件的路径，用于加载引用的js文件
/*function getJSPathbyName(jsname) {
    var js=document.scripts;
    var jsPath;
    for(var i=js.length;i>0;i--){
        var index = js[i-1].src.lastIndexOf("\/");
        var strname  = js[i-1].src .substring(index + 1, js[i-1].src .length);
        if( strname==jsname){
            jsPath=js[i-1].src.substring(0,js[i-1].src.lastIndexOf("/")+1);
        }
    }
    return jsPath;
}*/

//加载js
function loadScript(url) {
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = url;
    document.body.appendChild(script);
}

function loadJS(url, success) {
    var domScript = document.createElement('script');
    domScript.src = url;
    success = success || function () {
        };
    domScript.onload = domScript.onreadystatechange = function () {
        if (!this.readyState || 'loaded' === this.readyState || 'complete' === this.readyState) {
            success();
            this.onload = this.onreadystatechange = null;
            this.parentNode.removeChild(this);
        }
    }
    document.getElementsByTagName('head')[0].appendChild(domScript);
}

//加载css
function loadStyles(url) {
    var link = document.createElement("link");
    link.type = "text/css";
    link.rel = "stylesheet";
    link.href = url;
    document.getElementsByTagName("head")[0].appendChild(link);
}



//加载依赖项，js,scc
$(function () {

    $LAB.script(getJSPathbyName("ProgressBar.js") + "jquery.myProgress.js").wait();
    loadStyles(getJSPathbyName("ProgressBar.js") + "myProgress.css");


})
